<template>
  <div>
    <van-nav-bar left-arrow style="background: blue">
      <template #left>
        <van-icon name="arrow-left" color="#fff" size="20" />
      </template>
      <template #title>
        <span style="color: #fff">拜访记录</span>
      </template>
      <template #right>
        <span style="color: #fff" @click="newCustomer">新增</span>
      </template>
    </van-nav-bar>

    <div class="search">
      <van-search
        v-model="value"
        show-action
        shape="round"
        placeholder="客户名称/拜访记录"
      >
        <template #action>
          <div>搜索</div>
        </template>
      </van-search>
    </div>

    <div class="content">
      <div class="content_pt">
        <!-- @ = ../assets
          @/pic1.png =  ../assets/pic1.png -->
        <img src="../assets/我的客户.png" alt="" />
      </div>
      <div>
        <div class="content_center content_r">
          <div>拜访标题 <span class="span_r">重要商务会议</span></div>
          <span style="border: 1px solid orange">定期回访</span>
        </div>

        <div class="content_r">客户名称 <span class="span_r">林丹</span></div>

        <div class="content_r">
          拜访时间 <span class="span_r">2012-1-1</span>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import { getVisit } from "@/request/api";
export default {
  data() {
    return {
      value: "",
    };
  },
  created() {
    getVisit({
      current: 1,
      size: 10,
      keyword: "",
    }).then((res) => {
      console.log(res.data);
    });
  },
  methods:{
    newCustomer(){
      this.$router.push('/newcustomer')
    }
  }
};
</script>

<style>
.content {
  display: flex;
  background: #fff;
  padding: 0.8rem;
}
.content_pt {
  margin-right: 1rem;
}
.content_center {
  display: flex;
  flex: 1;
  justify-content: space-between;
}
.search {
  margin-bottom: 0.6rem;
}
.span_r {
  margin-left: 0.3rem;
}
.content_r {
  margin: 0.4rem;
}
</style>
